/** biome-ignore-all lint/suspicious/noExplicitAny: This use requires any */
"use client";

import { type TLinkElement } from "platejs";
import { type PlateElementProps } from "platejs/react";

import { useLink } from "@platejs/link/react";
import { PlateElement } from "platejs/react";

export function LinkElement(props: PlateElementProps&lt;TLinkElement&gt;) {
  const { props: linkProps } = useLink({ element: props.element });

  return (
    &lt;PlateElement
      {...props}
      as="a"
      className="font-medium text-primary underline decoration-primary underline-offset-4"
      attributes={{
        ...props.attributes,
        ...(linkProps as any),
      }}
    &gt;
      {props.children}
    &lt;/PlateElement&gt;
  );
}
